import React from 'react'
import "./App.css"
class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      List: ['苏鑫', '书写', '速写', '觉得', 'uhcdh', 'ghhuyhu'],
      isShow: false
    }
  }
  render() {
    return (
      <div>
        <input type="text" placeholder="请输入内容" onfocus={() => {
          this.setState({
            isShow: true
          })
        }} onBlur={()=>{
          this.setState({
            isShow: false
          })
        }} />
        <div className="app_item" >
          {
            this.state.List.map((ele) => {
              return <div key={ele}>{ele}</div>
            })
          }
        </div>
      </div>
    )
  }
}

export default App;

// import React, { Component } from 'react'
// import Header from "./components/Header"
// export class App extends Component {
//   constructor(props) {
//     super(props);
//     this.state = {
//       headerList: ['123', '456', '789', '147', '258', '369', '357'],
//       msg:""
//     }
//   }

//   footer=(message)=>{
//     console.log(message);
//     this.setState({
//       msg:message
//     })
//   }
//   render() {
//     return (
//       <div>
//         <Header headerList={this.state.headerList} 
//         footer={this.footer}/>
//         <div>{this.state.msg}</div>
//       </div>
//     )
//   }
// }

// export default App
